//
//  RectToCircle.swift
//  SwiftUIAnimation
//
//  Created by 李煜 on 2024/8/20.
//

import SwiftUI
// 矩形->圆形
struct RectToCircle: View {
  // 开始录音 矩形->圆形
  @State private var recordBegin = false
  //  正在录音 micro->缩放
  @State private var recoding = false

  var body: some View {
    ZStack {
      RoundedRectangle(cornerRadius: recordBegin ? 30 : 5)
        .frame(width: recordBegin ? 60 : 250, height: 60)
        .foregroundStyle(recordBegin ? .red : .green)
        .overlay {
          Image(systemName: "mic.fill")
            .foregroundStyle(.white)
            .font(.system(.title))
            .scaleEffect(recoding ? 0.7 : 1)
//            .background(Color.blue)
        }
      RoundedRectangle(cornerRadius: recordBegin ? 35 : 10)
        .trim(from: 0, to: recordBegin ? 0.0001 : 1)//注意这个0.0001的处理
        .stroke(lineWidth: 5)
        .frame(width: recordBegin ? 70 : 260, height: 70)
        .foregroundStyle(.green)
    }
    .onTapGesture {
      withAnimation(.spring) {
        self.recordBegin.toggle()
      }
      withAnimation(.spring.repeatForever().delay(0.5)) {
        self.recoding.toggle()
      }
    }
    .padding(20)

    ZStack {
      RoundedRectangle(cornerRadius: recordBegin ? 30 : 5)
        .frame(width: recordBegin ? 60 : 250, height: 60)
        .foregroundStyle(recordBegin ? .red : .green)
        .overlay {
          Image(systemName: "mic.fill")
            .foregroundStyle(.white)
            .font(.system(.title))
            .scaleEffect(recoding ? 0.7 : 1)
            .animation(.spring.repeatForever().delay(0.5), value: recoding)
//            .background(Color.blue) //背景色
        }
      RoundedRectangle(cornerRadius: recordBegin ? 35 : 10)
        .trim(from: 0, to: recordBegin ? 0 : 1)
        .stroke(.green, lineWidth: 5)
        .frame(width: recordBegin ? 70 : 260, height: 70)
    }
    .onTapGesture {
      recordBegin.toggle()
      recoding.toggle()
    }
  }
}

#Preview {
  RectToCircle()
}
